<template>
	<view class="content">
		<!-- 搜索框 -->
		<view class="search_item">
			<image src="../../static/search_logo.png" mode="" class="search_icon"></image>
			<input v-model="orderNo" type="text" id="search_input" placeholder="请输入订单号">
			<button @click="searchOrder" class="search_btn">搜索</button>
		</view>

		<!-- 卡券展示 -->
		<view class="card_list" v-if="orderData && orderData.length > 0">
			<view class="card_item" v-for="(card, index) in orderData" :key="index">
				<view class="card_code">
					兑换码：{{ card.code }}
				</view>
				<view class="card_pwd">
					卡密：<image :src="card.couponCode" mode="widthFix" class="pwd_icon">
					</image>
				</view>
			</view>
			<view class="no_more">
				没有更多了
			</view>
		</view>

		<!-- 无卡券提示 -->
		<view v-else style="text-align: center;margin: 200rpx 0;color:#aaaaaa">
			<text>没有数据噢~</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderNo: '', // 订单号
				orderData: null, // 存储订单数据
			};
		},
		onLoad(options) {
			console.log('options', options.p);
			this.orderNo = options.p
			this.searchOrder()
		},
		methods: {

			// 搜索订单
			async searchOrder() {
				console.log("订单号:", this.orderNo); // 打印订单号，确认是否获取到了
				// 发起请求
				try {
					uni.request({
						url: 'http://fykq.appldkj.com/api/jeecg-boot/app/card/goodfishOrder/queryByOrderNo',
						method: 'GET',
						data: {
							orderNo: this.orderNo.trim(), // 传递订单号
						},
						success: (res) => {
							console.log(res.data.result);
							if (res.data.success === false) {
								uni.showToast({
									title: res.data.message || '订单查询失败',
									icon: 'none',
								});
								this.orderData = null;
							} else if (res.data.result?.length > 0) {
								this.orderData = res.data.result
							} else {
								this.orderData = null;
							}
						},
						fail: (error) => {
							uni.showToast({
								title: '查询失败',
								icon: 'none',
							});
							console.error('请求失败:', error);
						},
					});
				} catch (error) {
					uni.showToast({
						title: error || '查询失败',
						icon: 'none',
					});
				}
			}
		},
	};
</script>

<style>
	.content {
		width: 100%;
		height: 100vh;
		background-color: #f3f3f3;
	}

	.search_item {
		width: 750rpx;
		height: 100rpx;
		background-color: #f3f3f3;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.search_icon {
		position: absolute;
		left: 45rpx;
		width: 30rpx;
		height: 30rpx;
	}

	#search_input {
		width: 580rpx;
		height: 70rpx;
		border: 1rpx solid #b5defb;
		border-radius: 34rpx;
		font-size: 28rpx;
		color: #c0c4cc;
		background-color: #ffffff;
		padding: 0 55rpx;
	}

	.search_btn {
		position: absolute;
		right: 40rpx;
		width: 120rpx;
		height: 60rpx;
		line-height: 60rpx;
		font-size: 28rpx;
		color: #ffffff;
		background-color: #0090f6;
		border-radius: 40rpx;
		border: none;
	}

	.card_item {
		padding: 20rpx;
		margin: 20rpx auto;
		width: 670rpx;
		height: 100%;
		font-size: 28rpx;
		border-radius: 20rpx;
		background-color: #ffffff;
	}

	.pwd_icon {
		width: 210rpx;
	}

	.no_more {
		text-align: center;
	}

	.card_code {
		margin-bottom: 20rpx;
	}

	.coupon_code {
		margin-bottom: 20rpx;
		color: #666;
	}

	.card_pwd {
		display: flex;
		align-items: top;
	}
</style>